{% extends "servis/base.html" %}

{%block title %}
Sazebník
{%endblock %}

{%block scripts %}
    function editItem(event){
	    var id = this.className;
	//$("tr").filter(".data").hide("slow").end;	
	var nazev_ukonu = $('#data_' + id + ' td.nazev_ukonu').text();
	$("#data_" + id + " td.nazev_ukonu")
		.html('<input type="text" name="nazev_ukonu" id="nazev_ukonu_input_'+id+'" size="20" value="' + nazev_ukonu + '" />');
	var popis_ukonu = $('#data_' + id + ' td.popis').text();
	$("#data_" + id + " td.popis")
		.html('<textarea  name="popis" id="popis_textarea_'+id+'" cols="40" rows="3" >' + popis_ukonu +'</textarea>');
	var cena_ukonu = $('#data_' + id + ' td.cena').text();
	$("#data_" + id + " td.cena")
		.html('<input type="text" name="cena" 	id="cena_input_'+id+'" size="20"		value="' + cena_ukonu + '" />');
	$("#data_" + id + " td.tlacitko  input")
		.val('Uložit').unbind().click(function (event) { saveItem(event, id); });


    }

    function saveItem(event, id) {
	var nazev_ukonu = $("#data_" + id + " td.nazev_ukonu input#nazev_ukonu_input_" + id).val();
	var popis = $("#data_" + id + " td.popis textarea#popis_textarea_" + id).val();
	var cena = $("#data_" + id + " td.cena input#cena_input_" + id).val();

	$.ajax({type: 'POST',
		url: '/servis/polozka-sazebniku/' + id + '/upravit/',
		data: {nazev_ukonu: nazev_ukonu, popis:popis, cena:cena},
		beforeSend: showProgressBar,
		error: onSaveItemError,
		success: function (data) { onSaveItemSuccess(data, id,
			nazev_ukonu, cena, popis);
		},
	       	});


	 event.preventDefault();
    }
    function showProgressBar(){
	 $("div#zpravy").html('<img src=\"/site_media/images/progress.gif\" /> Ukládání změn').show();
    }

    function onSaveItemError(request, error, exception){
        $("div#zpravy").html('Zpracování změny se nezdařilo').show();
	window.setTimeout(function(){ 	$("div#zpravy").hide("slow")}, 2000);
	window.setTimeout(function () { document.location.reload() }, 2000);

    }
    function onSaveItemSuccess(data, id, nazev_ukonu,cena, popis){
	
 	$("#data_" + id + " td.nazev_ukonu").html(nazev_ukonu);

	$("#data_" + id + " td.cena").html(cena);

	$("#data_" + id + " td.popis").html(popis);
	
	$("#data_" + id + " td.tlacitko	input").val('Upravit').unbind().click(editItem);

	$("div#zpravy").html('Položka úspěšně změněna').show();
	window.setTimeout(function(){ 	$("div#zpravy").hide("slow")}, 2000);

  
   }

$(document).ready(function () {
	$(".data td.tlacitko input").click(editItem);
});

{%endblock %}

{%block content %}
{% if sazebnik_list %}
	<table>
		<tr>
			<td><h3>Sazebník</h3></td>
			<td><a href="/servis/polozka-sazebniku/novy/"
			title="Nová položka sazebníku">Nová položka sazebníku</a></td>
			</tr>
		</table>
		<div id="zpravy"></div>
	<table class="list">
		<tr class="tablehead">
			<th>Název úkonu</th>
			<th>Popis</th>
			<th>Cena</th>
			<th>Četnost</th>
			<th>Akce</th>

		<tr>
    {% for p in sazebnik_list %}
        <tr class="data" id="data_{{p.id}}" >
		<td class="{{p.id}} nazev_ukonu">{{p.nazev_ukonu }}</td>
		<td class="{{p.id}} popis" width="300">{{p.popis}}</td>
		<td class="{{p.id}} cena" >{{p.cena}}</td>
		<td class="{{p.id}}">{{p.cetnost}}%</td>
		<td class="tlacitko">
			<form>
		       		<input 	type="button" value="Upravit" class="{{p.id}}"/>
			</form>
		</td>
	</tr>
    {% endfor %}
    </table>
<p>
<table><tr>
{% ifnotequal sazebnik_page 0 %}
<td><a href="/servis/sazebnik/{{predchozi}}/"
title="Předchozí">Předchozí</a> </td>
{% endifnotequal %}
{% if nasledujici %}
<td>
<a href="/servis/sazebnik/{{nasledujici}}/"
title="Následující">Následující</a> </td>
{% endif %}
</tr>
</table>
</p>
{% else %}
    <p>Není žádná položka sazebníku.</p>
	<p><a href="/servis/polozka-sazebniku/novy/" title="Nová položka sazebníku">Nová položka sazebníku</a></p>
{% endif %}

{%endblock content %}
